window.onload = function(){
	search();
	banner();
	downTime();
	navUl();
	llgd.changePage(function(){
		$('#qrCode').show();
		$('#login').hide();		
	})
	
}
var bannerBox = document.querySelector('.banner');
function search(){
	var searchBox = document.querySelector('.header_box');
	var height = bannerBox.offsetHeight;
	
	window.onscroll=function(){
		var opacity = 0;
		var top=0;
		if (document.body.scrollTop) {
			top = document.body.scrollTop;
		}else{
			top = document.documentElement.scrollTop;
		}
		if (top<height) {
			opacity = 0.85*top/height;
		}else{
			opacity=0.85;
		}
		searchBox.style.background = "rgba(236,53,100,"+opacity+")";
	}
}
//轮播图
function banner(){
	var width = bannerBox.offsetWidth;
	var imageBox = bannerBox.querySelector('ul');

	//公共方法
	var setTransition = function(){
		imageBox.style.webkitTransition = "all 0.5s";
		imageBox.style.transition = "all 0.5s";
	}
	var removeTransition = function(){
		imageBox.style.webkitTransition = "none";
		imageBox.style.transition = "none";
	}
	var setTranslateX = function(x){
		imageBox.style.webkitTransform = "translateX("+x+"px)";
		imageBox.style.transform = "translateX("+x+"px)";
	}
	//自动播放
	var index = 1;
	var timer = setInterval(function(){
		index++;
		setTransition();
		setTranslateX(-index*width);
	}, 1000);
	//克隆第一个节点，实现无缝滚动
	var lastCloneLi = imageBox.querySelector('li:last-of-type').cloneNode(true);
	var firstCloneLi = imageBox.children[0].cloneNode(true);
	imageBox.insertBefore(lastCloneLi,imageBox.firstChild);
	imageBox.appendChild(firstCloneLi);
	length = imageBox.children.length
	
	llgd.transitionEnd(imageBox,function(){
		if (index>=length-1) {
			index = 1;
		}else if(index<=0){
			index=length-2;
		}
		removeTransition();
		setTranslateX(-index*width);
		setPoint();
	})

	//ol导航
	var ol = document.querySelector('ol');
	for (var i = 0; i < length-2; i++) {
	 	var li = document.createElement('li');
	 	ol.appendChild(li);
	}
	ol.children[0].className="now";
	var setPoint = function(i){
		for (var i = 0; i < ol.children.length; i++) {
			ol.children[i].className="";
		}
		ol.children[index-1].className="now";
	}
	//触摸操作
	var startX = 0;
	var moveX = 0;
	var distanceX = 0;
	var isMove = false;
	imageBox.addEventListener('touchstart', function(e){
		clearInterval(timer);
		startX = e.touches[0].clientX;
	});
	imageBox.addEventListener('touchmove',function(e){
		isMove = true;
		moveX = e.touches[0].clientX;
		distanceX = moveX - startX;
		// alert('isMove');

		//清除过渡，实现页面滑动
		removeTransition();
		setTranslateX(-index*width+distanceX);
	});
	window.addEventListener('touchend',function(e){
		//滑动结束，添加过渡，当滑动超不过三分之一时恢复原来状态
		if (isMove && Math.abs(distanceX) > (width/3)) {
			if (distanceX>0) {
				index--;
			}else{
				index++;
			}
		}
		setTransition();
		setTranslateX(-index*width);

		//恢复自动轮播
		timer = setInterval(function(){
			index++;
			setTransition();
			setTranslateX(-index*width);
		}, 3000)
	})
}
// 倒计时
function downTime(){
	var skTime = document.querySelector('.sk_time');
	var spans = skTime.querySelectorAll('span');
	var time = 10;
	var timer = setInterval(function(){
		time--;
		if (time<0) {
			clearInterval(timer);
			return;
		}
		var h = Math.floor(time/3600);
		var m = Math.floor(time%3600/60);
		var s = Math.floor(time%3600);
		spans[0].innerHTML = Math.floor(h/10);
		spans[1].innerHTML = h%10;
		spans[3].innerHTML = Math.floor(m/10);
		spans[4].innerHTML = m%10;
		spans[6].innerHTML = Math.floor(s/10);
		spans[7].innerHTML = s%10;
	}, 1000)
	

}
function navUl(){
	$('#navUl').on('click','a',function(e){
		e.preventDefault();
		var cate = $(this).children()[1].innerText;
		
		llgd.changePage(function(){
			if (cate === '分类') {
				location.href = '/index/category/index.html';
			} else if (cate === '购物') {
				location.href = '/index/shopcar/index.html';
			} else {
				alert('页面暂无');
				location.href = '/index/index/index.html';
			}
		});
		
		// llgd.changePage();
	})
}